<template>
	<view class="contain">
		<view class="header">
			<uni-list>
				<uni-list-item :title="lineidlist.first+'-->'+lineidlist.end" :note="'运行时间'+lineidlist.startTime+'--'+lineidlist.endTime"></uni-list-item>
			</uni-list>
			<scroll-view scroll-with-animation="true" :scroll-left="scrollL"  scroll-x="true" style="margin: 20px 0px;">
				<image  ref="iconbus" class="posi" :style="styleobj" src="../../static/bus.png" mode="widthFix"></image>
				<view class="" style="width: 300%;">
					<uni-steps :options="option" :active="active"></uni-steps>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	// 根据id的传入，查找对应地铁信息
	import {getidline} from '@/utils/subway/index.js'
	export default {
		data() {
			return {
				lineid:"",
				lineidlist:[],
				option:[],
				i:0,
				active:7,
				bus:0,
				styleobj:{
					left:"0"
				},
				scrollL:0
			}
		},
		onLoad(e) {
			this.lineid=e.lineId
			this.getidlin()
			this.scrollL=this.active*25	
			
		},
		onReady() {
			console.log(this.$refs.iconbus)
			
		},
		methods: {
			async getidlin(){
				const res=await getidline(this.lineid)
				console.log(res)
				this.lineidlist=res.data.data
				for(let i=0;i<=this.lineidlist.metroStepList.length;i++){
					this.option.push({"title":this.lineidlist.metroStepList[i].name})
					if(this.lineidlist.metroStepList[i].name==this.lineidlist.runStationsName){
						this.bus=i
						this.styleobj.left=i*60+ "px"
						console.log(this.styleobj)
						console.log("---------------------")
						console.log(this.bus)
					}
					
				}
				console.log(this.option)
				uni.setNavigationBarTitle({
					title:this.lineidlist.name
				})
			}
		}
	}
</script>

<style>
	.posi{
		position: relative;
		width: 30px;
	}
	

</style>
